<template>
<div class="t1">
<el-table
    :data="tableData"
    style="width: 100%;margin-bottom: 20px;"
    row-key="id"
    border
    lazy
    show-summary
    :load="load"
    :header-cell-style="{
		'background-color': '#169098',
	    'color': '#fff',
	}"
    :tree-props="{children: 'children', hasChildren: 'hasChildren'}">
    <!-- <el-table-column
      label="头像"
      width="180">
      	<template  slot-scope="scope">
      		<img :src="scope.row.headimg" width="24" height="24" />
      	</template>
    </el-table-column> -->

    <el-table-column
      prop="nickname"
      label="昵称"
      show-overflow-tooltip
      width="180">
    </el-table-column>
    <el-table-column
      prop="real_name"
      label="真实姓名"
      align="center"
      width="100">
    </el-table-column>
    <el-table-column
      label="电话"
      align="center"
      width="130">
        <template  slot-scope="scope">
          {{scope.row.mobile}}
        </template>
    </el-table-column>
    

    <el-table-column
      prop="apply_total_num"
      label="总数量"
      align="center"
      width="100">
    </el-table-column>

    <el-table-column
      prop="apply_receive_num"
      label="已领取"
      align="center"
      width="100">
    </el-table-column>

    <el-table-column
      prop="apply_surplus_num"
      label="剩余数量"
      align="center"
      width="100">
    </el-table-column>

    <el-table-column
      prop="company"
      label="企业"
      align="center"
      show-overflow-tooltip
      >
    </el-table-column>
  </el-table>
</div>
</template>

<script>


export default {
	
	name : 'ticket',
	
	data () {
		return {
			  tableData : [],
		
		  	defaultProps : {
		  		//label : 'nickname',
		  	},

        chae : {
            '0376ff8f83df4097bc8b677bc9b98ab0' : 16,
            '120825b7-522f-ec6f-711b-0302b33ed1ab' : 990,
            '195c39c441744942b1205d4f87c4a4ff' : 0,
            '35bd1dbc-140e-e8bb-c273-9272bd9942ef' : 0,
            '591bb3f07ff24613b12a7b7b2174cb49' : 0,
            '59461749def549848a89b5f907c73aa8' : 543,
            '599b260d-41d6-ff34-3242-bd2ebf2eb188' : 342,
            '5d2c10a0-2f42-5dcc-7952-0b2633586dc3' : 131,
            '6a54c04e-d2b3-7f8c-a5e3-ebf72b244c5b' : 325,
            '6f70cb64-f6d4-1e80-cd15-657aaf1bd04b' : 0,
            '7a896e6716444089ae7e91e20158937e' : 55,
            '849de8373b5b482ba389b63c66fb3681' : 52,
            '876a0d74-f8f0-fe6d-f245-c89a3ac505e3' : 226,
            '89a2dfd38fe74a1eb15a1f9e3930c4e5' : 105,
            '94c6fa0a-2154-8b23-5303-385d4137c57f' : 1,
            '9ae2977aac6d4a72ae09faa1053332e9' : 69,
            'a6348718-e80b-0c71-2af4-0312331f74b1' : -1,
            'be724d46-c01f-c29e-bab5-57cd0004a7ab' : 38,
            'c213207559f142b58f23a365d2c78f50' : 302,
            'ca6c6367-a2c8-7e30-c9c0-98187a3172f2' : 201,
            'e0d3efe8-526f-02bc-1edc-01d5bf3a6ba5' : 285,
            'e2714091407b4b93b4b3580d1c2cb5c6' : 27,
            'e49dd280-fd60-5490-ee39-cefeecc3179c' : 92,
            'e5ae2db325a6470c87788088e96b1bea' : 0,
            'ecf25469-6fe6-bbb8-44d5-dd5884400581' : 5,
            'f17c2e78-9418-9092-7e82-5af045d00513' : 42,
            'f790fe6ed5a6471b8c131ccc4a09076c' : 236,
            'f8f16ef2-42e9-a6c1-6f09-f6485794f1eb' : 2,
            'f9cc840d-ba8b-4389-baee-b9b4fb5a16ce' : 0,
            'ff215cea-2559-94c1-b1fa-35ffc59f3e9c' : 340,
        }
		}
	},

	props : {

	},

	components : {
		
	},

	computed : {

	},

	methods : {
		init () {
      console.log('init');
			this.$http({
				fun : 't4',
				cb : res => {

          let arr = [];
          res.forEach(item => {
            if(item.mobile == '18842514682'
            || item.mobile == '13889178077'
            || item.mobile == '15142001916'
            || item.mobile == '13072476668'
            || item.mobile == '15840491086'
            || item.mobile == '18524405849'){
              
            }else{
              item['hasChildren'] = true;
              item['mobile'] = item.mobile.toString();

              //已领取
              item['apply_receive_num'] += this.chae[item.wxuid];
              //剩余数量
              item['apply_surplus_num'] -= this.chae[item.wxuid];


              // if(item.wxuid == '120825b7-522f-ec6f-711b-0302b33ed1ab'){
              //   item['apply_receive_num'] = 50000;
              //   item['apply_surplus_num'] = 0;
              // }
              arr.push(item);
            }
          })
					this.tableData = arr;

					console.log('ok');
				}
			})

		},

		handleNodeClick () {


		},

		load (tree, treeNode, resolve) {

			console.log(tree);
			console.log(treeNode);

			this.$http({
				fun : 't5',
				pwxuid : tree.wxuid,
				cb : res => {
					console.log('t3');
					console.log(res);

					res.forEach(item => {
						item['hasChildren'] = true;

            // if(item.wxuid == '8854a371126e41ef834b7262958f33d4'){
            //   item['apply_receive_num'] = 50000;
            //   item['apply_surplus_num'] = 0;
            // }
					})
					resolve(res);

				}
			});

		},
	},

	watch : {
	    
	},

	mounted () {
		this.init();
	},

}
</script>

<style scoped>
.t1 {
	padding: 20px;
	background:rgba(8,55,73,1);
}

.custom-tree-node {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    font-size: 14px;
    padding-right: 8px;
  }
</style>
